<template>
  <a-modal
      :dialogStyle="{
        maxWidth: '100vw',
        top: this.terminalFullscreen ? 0 : false,
        paddingBottom: 0,
      }"
      :width="this.terminalFullscreen ? '100vw' : '80vw'"
      :bodyStyle="{
        padding: '0px 10px',
        paddingTop: '10px',
        marginRight: '10px',
        height: `${this.terminalFullscreen ? 'calc(100vh - 56px)' : '70vh'}`,
      }"
      v-model="terminalVisible"
      :title="title"
      :footer="null"
      :maskClosable="false"
      :destroyOnClose="true"
    >
      <terminal v-if="terminalVisible" :url="this.socketUrl" />
    </a-modal>
</template>

<script>
import terminal from "../../components/terminal"
export default {
  name: 'SshModal',
  mixins: [],
  components: {
    terminal
  },
  data() {
    return {
      terminalVisible:false,
      terminalFullscreen:false,
      sshId:'',
      title:'--终端--',
    }
  },
  computed: {
    socketUrl() {
      const protocol = "ws://";
      const fullUrl = ('/socket/ssh').replace(new RegExp("//", "gm"), "/");
      return `${protocol}${'101.42.250.62:8080'}${fullUrl}?&id=${this.sshId}`;
    },
  },
  methods: {
    open(row) {
      this.sshId = row.id
      this.title = `${row.name}:${row.host}`
      this.terminalVisible = true
    }
  }
}
</script>
